
<form action="/orders" class="form-inline" method="post" accept-charset="utf-8">
<div class='row' style='text-align:center;'>
	<div class='span6 offset4'>
<h1>Vos dates de r&eacute;servation</h1>
</div>
</div>
<div class='row' style='text-align:center;margin:0px auto 50px'>
<span class='span3 offset4'>
	<label for="bookingstartdate" class='label'>Date d'emprunt</label><br>
	<input type="text" class="datepicker input-small" name="data[Order][bookingstartdate]" id='bookingstartdate'/> 
</span>
<span class='span2'>
	<label for="bookingenddate" class="label">Date de retour</label><br>
	<input type="text" class="datepicker input-small" name="data[Order][bookingenddate]" id='bookingenddate'> 
</span>
</div>

<table class='table table-condensed table-striped'>
<caption><h1>Votre panier<h1></caption>
<?php
	echo $this->ProductBuilder->displayProductTableHeader();
	foreach($Cart as $order_id => $currentOrder){
		if(is_numeric($order_id)){
			echo $this->ProductBuilder->displayProductTableRow($currentOrder, $order_id);
		}
	}
?>

</table>
 <div class="form-actions">
    <?php echo $this->Form->submit('Valider la commande', array('div'=>false,'class'=>'btn btn-primary'))?>
    <?php echo $this->Html->Link('Ajouter des articles',array('controller'=>'Products', 'action'=>'index'), array('class'=>'btn'))?>
 </div>
 </form>
 <script type='text/javascript'>
 $(document).ready(function(){
		$('.datepicker').datepicker(
			{
				 //appendText: "(yyyy-mm-dd)" ,
				 dateFormat: "yy-mm-dd",
				 dayNames: [ "Dimanche", "Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi" ],
				 dayNamesMin: [ "Di", "Lu", "Ma", "Me", "Je", "Ve", "Sa" ] ,
				 dayNamesShort: [ "Dim", "Lun", "Mar", "Mer", "Jeu", "Ven", "Sam" ] ,
				 firstDay: 1,
				 gotoCurrent: true,
				 monthNames: [ "Janvier", "Fevrier", "Mars", "Avril", "Mai", "Juin", "Juillet", "Aout", "Septembre", "Octobre", "Novembre", "Decembre" ],
				 monthNamesShort: [ "Jan", "Fev", "Mar", "Avr", "Mai", "Jun", "Jul", "Aou", "Sep", "Oct", "Nov", "Dec" ],
				 showAnim: "slide",
				 showOptions: { direction: "up" },
				 
			}
		);
		$('#bookingstartdate').val('<?php echo $bookingstartdate ?>');
		$('#bookingenddate').val('<?php echo $bookingenddate ?>');
		
		$('.row_order').each(function(i,obj){
				var maxSliderValues = {"Vaisselle Economique":500,
					 "Vaisselle Buvette":   2000,
					 "Vaisselle Classique": 120,
					 "Vaisselle Plastique": 200};
		
				//Container
				var ctn_slider = $(obj).find('.slider');
				var ctn_price = $(obj).find('.total_price');
				var ctn_bond = $(obj).find('.total_bond');
				var ctn_associateprice = $(obj).find('.total_associateprice');
				var ctn_remove_field = $(obj).find('.remove_field');
				
				//Values
				var productType = $(obj).find('.productType').val();
				var maxSlider = maxSliderValues[productType];
				var currentValue = Number($(obj).find('.number').val());
				var orderId = Number($(obj).find('.order_id').val());
				var unity_price = Number($(obj).find('.unity_price').val());
				var associatePrice = Number($(obj).find('.unity_associateprice').val());
				var bond = Number($(obj).find('.unity_bond').val());
				
				
				//Initialise
				ctn_price.text((currentValue * unity_price).toFixed(2));
				ctn_associateprice.text((currentValue * associatePrice).toFixed(2));
				ctn_bond.text((currentValue * bond).toFixed(2));
				
				//SLIDER
				ctn_slider.slider({
					animate: true,
					range:'min',
					value: currentValue,
					min: 1,
					max: maxSlider,
					step: 1,
					slide: function( event, ui ) {
						ctn_price.text((ui.value * unity_price).toFixed(2));
						ctn_associateprice.text((ui.value * associatePrice).toFixed(2));
						ctn_bond.text((ui.value * bond).toFixed(2));
					},
					change: function(event, ui){
						updateOrder(ui.value , orderId);
					}
				});
				
				//DELETE BUTTON
				ctn_remove_field.click(function(){
					var request = {};
					request.id = orderId;
					var jsonRequest = JSON.stringify(request);

					$.ajax({
						url: '<?php echo Router::url(array('controller'=>'orders','action'=>'delete'),true);?>',
						type: 'post',
						dataType: 'json',
						data: {data: jsonRequest},
						success: function(response) {
							updateCart(response.summary.totalPrice);
							$(obj).fadeOut();
							console.log(response);
						},
						error:function( req, status, err ) {
							console.log( 'something went wrong', status, err );
						}
					});
				});
		});			
	});	
 //***UPDATE ORDER***///
	function updateOrder(number , orderId){
		var request = {};
		request.id = orderId;
		request.number = number;
		var jsonRequest = JSON.stringify(request);
			
		$.ajax({
			url: '<?php echo Router::url(array('controller'=>'orders','action'=>'update'),true);?>',
			type: 'post',
			dataType: 'json',
			data: {data: jsonRequest},
			success: function(response) {
				updateCart(response.summary.totalPrice);
				$('tr#order_'+orderId).fadeOut();
				console.log(response);
			},
			error:function( req, status, err ) {
				alert(req.responseText);
				console.log( 'something went wrong', status, err );
			}
		});
	}
 </script>